/**
 * Created by Dalyn on 2017/5/4.
 */
import React from "react";
import Relay from 'react-relay';
import {hashHistory} from 'react-router';
import { Table,Icon,message } from 'antd';
import Pagination from "./Pagination";
import Util from '../../util/Util';
import OrderPaymentRecordMutation from './mutation/OrderPaymentRecordMutation';
import './css/paymentHistory.css';
import {Button,Modal} from 'fly';
import InputBox from '../../common/InputBox';
const { Column, ColumnGroup } = Table;

export default class ProductionProcess extends React.Component {
    constructor(){
        super();
        this.state={
            enId: sessionStorage.getItem('enterpriseId'),
            totalResult : '',          //分页总条数
            pageSize : '10',      //每页显示条数
            pageNum : '1',
            recordData: [],
            searchOrderId: '',
            loading: true,
        }
        this.uid = sessionStorage.getItem('uid')
        this.enterpriseId = sessionStorage.getItem('enterpriseId')
    }

    componentWillMount() {
      this.getOrderPaymentRecord()
    }

    getOrderPaymentRecord() {
      Relay.Store.commitUpdate(
          new OrderPaymentRecordMutation({
              enid: this.enterpriseId,
              orderId: this.state.searchOrderId,
            	pageNum: this.state.pageNum,
              pageSize: this.state.pageSize,
          }),
          {
              onFailure: () => {
                  message.error("请求失败")
                  this.setState({
                    loading: false
                  })
              },
              onSuccess: (response) => {
                let data = response.orderPaymentRecord.data
                if(data.errorCode == 0) {
                  if (data.orderPaymentRecordDomainList) {
                    this.setState({
                      recordData: data.orderPaymentRecordDomainList,
                      totalResult:data.totalResult,
                      loading: false,
                    })
                  }
                } else {
                  message.info(data.value)
                }
              }
          }
      );
    }

    _SearchByClient(){
        this.setState({
            pageNum: 1
        },()=>{
            this.getOrderPaymentRecord()
        })
    }
    searchChange(e) {
      this.setState({
        searchOrderId: this.refs.searchOrderId.state.text,
      })
    }

    /*页码*/
    onSure(size,num){
        this.num = num;
        this.setState({
            loading:true,
            pageNum:num,
        },this.getOrderPaymentRecord)
    }
    render() {
        return (
          <div className="record_box">
            <div className="record_head">
                <div style={{display:"inline-block",marginLeft:'20px',marginRight:'-3px'}}>
                    <InputBox className="order_saleandre_frome_search_input pro_overflow_inputSty "
                              space={20}
                              ref={"searchOrderId"}
                              defaultvalute="请输入订单号"
                              changeon={this.searchChange.bind(this)}
                    />
                </div>
                {/*<input className="" placeholder = '请输入订单号' value={this.state.searchOrderId}*/}
                       {/*onChange={this.searchChange.bind(this)} />*/}
                <Button onClick={this._SearchByClient.bind(this)}>搜索</Button>
            </div>
          <Table
            className="order_table"
            // bordered
            pagination={false}
            loading={this.state.loading}
            rowKey={record => record.paymentRecordId}
            dataSource={this.state.recordData}
            >
              <Column
                title="日期"
                dataIndex="createTime"
                key="createTime"
                render={(text, record)=>{
                  return Util.dateFormat(record.createTime)
                }}
              />
              <Column
                title="订单编号"
                dataIndex="orderId"
                key="orderId"
              />
              <Column
                title="供应商"
                key="partyBEnName"
                dataIndex="partyBEnName"
              />
              <Column
                title="订单金额"
                dataIndex="orderMoney"
                key="orderMoney"
                render={(text, record) => (
                  <span>
                    {Util.doubleFormat(record.orderMoney)}
                  </span>
                )}
              />
              <Column
                title="支付金额"
                dataIndex="payment"
                key="payment"
                render={(text, record) => (
                  <span>
                    {Util.doubleFormat(record.payment)}
                  </span>
                )}
              />
            <ColumnGroup title="支付明细">
                <Column
                  title="客户货款"
                  dataIndex="masterPayment"
                  key="masterPayment"
                  render={(text, record) => (
                    <span>
                      {Util.doubleFormat(record.masterPayment)}
                    </span>
                  )}
                />
                <Column
                  title="企业账户"
                  dataIndex="mainAccount"
                  key="mainAccount"
                  render={(text, record) => (
                    <span>
                      {Util.doubleFormat(record.mainAccount)}
                    </span>
                  )}
                />
                <Column
                  title="贷款"
                  dataIndex="loanMoney"
                  key="loanMoney"
                  render={(text, record) => (
                    <span>
                      {Util.doubleFormat(record.loanMoney)}
                    </span>
                  )}
                />
              </ColumnGroup>
            </Table>
            <br/>
              <Pagination eachSize={this.state.pageSize} dataSize={this.state.totalResult} onSure={this.onSure.bind(this)} ref={'pagination'}/>

          </div>
        )
    }
}
